@import "common/css/form.css";
@import "common/css/button.css";

:root {
  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
  line-height: 1.5;
  font-weight: 400;
  font-size: 10pt;

  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  --text-color-main: #333333;
  --text-color-light: #666666;
  --text-color-light2: #aaaaaa;

  --field-border: #d9d9d9;                /* 文本框边框色 */
  --field-border-focus: #bfdff3;          /* 文本框聚焦边框色 */
  --field-inset-shadow: #00000000;        /* 文本框阴影色 */
  --field-inset-shadow-focus: #0872b522;  /* 文本框聚焦阴影色 */
  --main-color: #0872b5;
  --main-background-color: #ffffff;
  --main-background-color-hover: #eeeeee;
  --main-background-color-active: #bedcec;
  --main-color-light: #4ca3da;
  --main-color-shadow: #0872b577;

  --datatable-header-bgcolor: #0872b5;
  --datatable-header-textcolor: #ffffff;
}

body, #app {
  margin: 0;
  padding: 0;
  display: flex;
  place-items: center;
  width: 100vw;
  /* Edge 浏览器如果不留 2 个像素出来的话，会显示滚动条 */
  height: calc(100vh - 2px);
  box-sizing: border-box;
}

.spacer {
  flex-grow: 1;
}

dialog {
  outline: unset;
  border: 1px solid var(--main-color);
  border-radius: 4px;
  padding: 0;
  box-shadow: 2px 2px 2px var(--field-inset-shadow);
}

